<template>
  <a-layout id="components-layout-demo-side" style="min-height: 100vh">
    <a-layout-sider v-model="collapsed" collapsible>
      <div class="logo" />
      <a-menu theme="dark" :default-selected-keys="[activepath]" mode="inline">
        <!-- 主页显示内容 -->
        <a-menu-item key="/manage/home" @click="tohome">
          <a-icon type="home" />
          <span >home</span>
        </a-menu-item>
        <!-- 博客管理操作 -->
        <a-menu-item key="/manage/bmanage" @click="tobrowser">
          <a-icon type="eye" />
          <span >博客管理</span>
        </a-menu-item>
         <!-- 用户管理操作 -->
        <a-menu-item key="/manage/usermanage" @click="topublish">
          <a-icon type="file-add" />
          <span >用户管理</span>
        </a-menu-item>
      </a-menu>
    </a-layout-sider>
    <a-layout>
      <!-- 头部主题区域 -->
      <a-layout-header style="background: #fff; padding: 0" >
        <a-avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" class="headerimg"/>
            <a-button type="link" class="logout" @click="logout">
              返回
            </a-button>
      </a-layout-header>
      <!-- 页面主题区域 -->
      <a-layout-content style="margin: 0 16px">
        <router-view></router-view>
      </a-layout-content>
      <a-layout-footer style="text-align: center">
        Personal Blog @2021.7 created by 8-621
      </a-layout-footer>
    </a-layout>
  </a-layout>
</template>
<script>
export default {
  data() {
    return {
      collapsed: false,
      activepath:''
    };
  },
  created(){
    if(this.activepath = '')
    {
      window.sessionStorage.setItem('activepath','/manage/home')
      this.activepath = window.sessionStorage.getItem('activepath')
      // this.$router.push(this.activepath)
    }
    else {
      this.activepath = window.sessionStorage.getItem('activepath')
       this.$router.push(this.activepath)
    }
  },
  methods: {
    tobrowser(){
      this.$router.push('/manage/bmanage') 
      window.sessionStorage.setItem('activepath','/manage/bmanage')
    },
    tohome(){
     this.$router.push('/manage/home')
     window.sessionStorage.setItem('activepath','/manage/home')
    },
    topublish(){
      this.$router.push('/manage/usermanage')
      window.sessionStorage.setItem('activepath','/manage/usermanage')
    },
    logout(){
       
      this.$router.push('/home')
    }
  }
};
</script>

<style>
#components-layout-demo-side .logo {
  height: 32px;
  background: rgba(255, 255, 255, 0.2);
  margin: 16px;
}
.logout{
  position: absolute;
  right: 15px;
  top: 3%;
}
.headerimg{
  position: absolute;
  right: 65px;
  top: 3%;
}
</style>